﻿import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Dialogs 1.2
import Qt.labs.platform 1.0
import "../components/"

// 导出图片

Window {

    id: root

    title: "图片预览"
    color: "#F6F6F6"

    minimumHeight: 800*dp
    minimumWidth: 1080*dp

    onVisibleChanged: {
        edit_exportPath.setText("./datao/")
        edit_chartTitle.setText(gStateExp.expName)
    }

    property real chartScaleX: 1
    property real chartScaleY: 1

    // 左侧的图片区域
    Rectangle{
        id: layout_left
        border.color: "#CCC"
        color: "#DDD"
        height: parent.height - layout_bottom.height - 3*8*dp
        width: parent.width - layout_right.width - 3*8*dp
        x: 8*dp; y: 8*dp
        CustomChart{
            id: chart
            color: "white"
            anchors.centerIn: parent
            cChartInterface: CChromChart
            width: {
                return Math.min(chartScaleX/chartScaleY * parent.height-2, parent.width-2)
            }height: {
                return Math.min(chartScaleY/chartScaleX * parent.width-2, parent.height-2)
            }

            isFullImage: true
            showScrollBar: false
            showChartTitle: title !== ""
            title: edit_chartTitle.getText()
            showTitleBtn: false
        }
    }

    // 右侧
    Item{
        id: layout_right
        width: 220*dp
        height: parent.height - 60*dp
        x: parent.width - width - 8*dp
        y: 8*dp
        Column{
            spacing: 5*dp
            anchors.fill: parent
            CustomComboBox{
                titleAlignJustify: false
                titleHAlign: Text.AlignLeft
                titleDirect: 1
                title: "宽高比"
                editWidth: parent.width
                model: ["1:1", "4:3", "2:1"]
                onTextChanged: {
                    chartScaleX = Number(getText().split(":")[0])
                    chartScaleY = Number(getText().split(":")[1])
                }
            }
            Row{
                height: edit_exportPath.height; width: parent.width
                CustomInputText{
                    id: edit_exportPath
                    titleAlignJustify: false
                    titleHAlign: Text.AlignLeft
                    titleDirect: 1
                    title: "导出路径"
                    editable: false
                    editWidth: parent.width - 60*dp
                }
                CustomButton{
                    title: "选择"
                    defaultMode2: true
                    width: 60*dp
                    anchors.bottom: parent.bottom
                    onClicked: {
                        fileDialog.open()
                    }
                }
            }
            CustomInputText{
                id: edit_chartTitle
                title: "图表标题"
                titleAlignJustify: false
                titleHAlign: Text.AlignLeft
                titleDirect: 1
                editWidth: parent.width

            }
//            CustomComboBox{
//                id: edit_chartTitlePosi
//                titleAlignJustify: false
//                titleHAlign: Text.AlignLeft
//                titleDirect: 1
//                model: ["左", "中", "右"]
//            }

        }
    }
    // 下侧
    Item{
        id: layout_bottom
        width: parent.width - 16*dp
        height: 40*dp
        x: 5*dp
        y: parent.height - height - 8*dp
        Row{
            spacing: 8*dp
            anchors.right: parent.right
            CustomButton{
                title: "取消"
                defaultMode2: true
                onClicked: {
                    root.close()
                }
            }CustomButton{
                title: "确定"
                defaultMode1: true
                onClicked: {
                    chart.grabToImage(function(result){
                        return result.saveToFile(edit_exportPath.getText() + "/" + Qt.formatDateTime(new Date(), "yyyyMMddhhmmss") + ".png")
                    })
                    root.close()
                }
            }
        }
    }

    // 保存图片路径
    FolderDialog{
        id: fileDialog
        title: "保存图片"
        onFolderChanged: {
            edit_exportPath.setText((folder).toString().replace("file:///", ""))
        }
    }
}
